<link rel="stylesheet" href="/cn/css/exerciseNew/speakResult.css?v=1.2">
<script type="text/javascript" src="https://file.viplgw.cn/ui/public/lib/vue/vue.js"></script>

<section id="exerciseDetail" v-cloak>
    <!-- 顶部 -->
    <div class="headNav">
        <template>
            <div class="w12 headContent">
                <div class="headTitle">{{questionData!=''?questionData.parent.name:''}}</div>
                <div class="clockTime">
                    <img src="/cn/images/exerciseNew/15@2x.png" alt="">
                    <!-- 用户做题 总时间 -->
                    <span>{{time}}</span>
                </div>
                <div class="operateBtn">
                    <img src="/cn/images/exerciseNew/16@2x.png" alt="" class="fullScreen"  @click="launchFullscreen">
                </div>
            </div>
        </template>
    </div>

    <input name="content_id" value="<?php echo $content_id?>" type="hidden" id="content_id">

    <!-- 答案部分 -->
    <div class="exerciseCenter">
        <div class="speakTitle">{{questionData!=''?questionData.son[0].description:''}}</div>
        <!-- 用户答案 -->
        <div class="operateBtnCover">
            <!-- 音频地址 隐藏 -->
            <audio id="bgAudio" :src="questionData!=''?questionData.son[0].userAnswer:''" controls ></audio>
            <p>你的答案：</p>
            <div class="audioCover">
                <a href="javascript:void(0)" class="playBtn" v-if="!isPlay" @click="playAudio">
                    <img src="/cn/images/exerciseNew/17@2x.png" alt="">
                </a>
                <a href="javascript:void(0)" class="pauseBtn" v-if="isPlay" @click="playAudio">
                    <img src="/cn/images/exerciseNew/stop.png" alt="">
                </a>
                <p class="time">{{currentTime}}/{{totalTime}}</p>
            </div>
        </div>
        <!-- 示例答案 -->
        <div class="example">
            <p class="exampleTitle">示例答案</p>
            <div class="exampleArticle">
                {{questionData!=''?questionData.son[0].alternatives:''}}
            </div>
        </div>
    </div>
    <!-- 底部按钮 -->
    <div class="footNav">
        <div class="footNavCover">
            <div class="reviewBtn">
                REVIEW
                <div class="reviewPop">
                    不确定答案，可随时review，方便再次检查（选中review后题号会变成圆形）
                </div>
            </div>
            <div class="quesNumCover">
                <!-- quesNum 未做  fulfil已做  doNow 正在做 notSure 不确定review-->
                <a href="javascript:void(0)" :class="{'quesNum':index>-1, 'fulfil': item.isDo == 1, 'notSure': item.status == 1, 'doNow': item.content_id == content_id }" v-for="(item,index) in questionData.question_list" @click="goNew(item.content_id)">{{index+1}}</a>
                <!-- 提示 跟随按钮位置-->
                <div class="quesPop" :style="{display:display,left:left}" v-cloak>
                    <p>白色：已答题</p>
                    <p>灰色：未答题</p>
                    <p>紫色：答题中</p>
                </div>
            </div>
            <div class="turnBtn">
                <a href="javascript:void(0)" class="prevBtn" @click="">
                    <img src="/cn/images/exerciseNew/18@2x.png" alt="">
                    <span>上一题</span>
                </a>
                <a href="javascript:void(0)" class="nextBtn" @click="">
                    <img src="/cn/images/exerciseNew/19@2x.png" alt="">
                    <span>下一题</span>
                </a>
            </div>
        </div>
    </div>


</section>




<script src="/cn/js/exerciseNew/speakResult.js?v=1.1"></script>


